<template>
  <div>
    <h3>index</h3>
    <!-- vue2 -->
    <p>用户信息：{{ $store.state.name }}--{{ $store.state.age }}</p>
    <p>{{ getName }}</p>
    <button @click="changeOne">修改仓库数据</button>
    <!-- vue3 -->
  </div>
</template>

<script>
import { mapGetters, mapState, mapActions, mapMutations } from "vuex";
import { useStore } from "vuex";
export default {
  setup() {
    let store = useStore();
    console.log(store.state.name);
  },
  data() {
    return {};
  },
  mounted() {},
  computed: {
    ...mapGetters(["getName"]),
  },
  methods: {
    changeOne() {
      // this.$store.commit('changeName', '王五')
      this.$store.dispatch("changeNameA", "王五");
    },
  },
};
</script>

<style scoped></style>
